$(function () {
  // 一- 表单校验 
  // 用户名： 非空 ， 2-6位 
  // 密码：  非空 ， 6-12位 
  $('.login-form').bootstrapValidator({

    //1. 指定不校验的类型，默认为[':disabled', ':hidden', ':not(:visible)'],可以不设置
    excluded: [':disabled', ':hidden', ':not(:visible)'],

    //2. 指定校验时的图标显示，默认是bootstrap风格
    feedbackIcons: {
      valid: 'glyphicon glyphicon-heart',
      invalid: 'glyphicon glyphicon-remove',
      validating: 'glyphicon glyphicon-refresh'
    },

    // 3- 设置校验字段(数据) 
    fields: {
      // 插件是根据 表单name属性将进行校验的 
      username: {
        // 校验规则 
        validators: {
          // 非空
          notEmpty: {
            message: '用户名不能为空'
          },
          // 长度校验
          stringLength: {
            min: 2,
            max: 6,
            message: '用户名必须2-6位'
          },
          //拓展一个 提示信息
          callback: {
            message:'用户名不存在！'
          }
        }
      },
      password: {
        // 校验规则 
        validators: {
          // 非空
          notEmpty: {
            message: '密码不能为空'
          },
          // 长度校验
          stringLength: {
            min: 6,
            max: 12,
            message: '密码必须是6-12位'
          },
          callback: {
            message:'密码错误！'
          }
        }
      }
    }
  })

  // 二， 重置表单样式
  // 1-点击重置按钮 
  // 2-通过插件实例 调用表单重置方法  resetForm() 
$('.btn-reset').click(function(){
  // console.log('hehe');  
  $('.login-form').data('bootstrapValidator').resetForm();
})

// 三， 登录页 
//   1- 点击登陆按钮，(阻止表单默认提交) 校验表单数据是否合理， 在数据合理情况下，  获取表单的数据 ， 通过ajax发送给后台
//   2- 后台根据前端传递信息 进行登陆校验， 返回登陆结果
//   3- 前端接收登陆结果： 
//     成功：跳转到首页 
//     失败：重新登陆，提示错误原因 

 // 表单校验插件提供 一个事件： success.form.bv 事件 ,会在用户点击提交按钮，并且数据校验通过时触发
  $('.login-form').on('success.form.bv',function(e){
    e.preventDefault();  //阻止表单默认提交
    // console.log(878787);
    // ajax发送请求，进行登陆验证 
    $.ajax({
      type:'post',
      url:'/employee/employeeLogin',
      data:$('.login-form').serialize(),
      dataType:'json',
      success: function (res){
        console.log(res);

        //VALID: 成功：
        //INVALID: 失败
        //成功
        if(res.success){
          //跳转到首页
          location.href = './index.html';
        }
        
        //失败
        if(res.error == 1000 ){
          // 把用户名的状态 由成功改为失败 
          //  updateStatus(字段name属性， 状态， 提示信息)   用实例来调用这个方法
          $('.login-form').data('bootstrapValidator').updateStatus('username', 'INVALID', 'callback');
        }

        if(res.error == 1001){
          // 把密码的状态 由成功改为失败
          $('.login-form').data('bootstrapValidator').updateStatus('password', 'INVALID', 'callback');
        }
      }
    })
  })
});